<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <style>
        html {
            background-color: antiquewhite;

            /* 想要Body的滚动单独生效，这里要设置 */
            overflow: auto;
        }
        

        body {
            height: 500px;
            background-color: pink;
            overflow: auto;
        }

        .box {
            height: 1000px;
            background-color: aqua;
            width:450px;
        }
    </style>
</head>

<body>

    <html>

    <body>
       <div class="box">
        如果html元素没有设置overflow属性，那么body元素的设置等同于设置在html元素上，否则，body元素的overflow属性按照普通元素渲染。
        <hr>
        html元素的overflow剪裁高度至少一个屏幕高度。
       </div>
    </body>

    </html>
</body>

</html>